<template>
  <main>
    <section class="clean-block clean-form dark" style="background: rgb(255,255,255);">
      <div class="container">
        <div class="block-heading">
          <h2 class="text-info">注册</h2>
          <p v-show="isUser">如果你是商家，请点击<el-button type="text" @click="changeRole()">这里</el-button></p>
          <p v-show="!isUser">如果你是个人，请点击<el-button type="text" @click="changeRole()">这里</el-button></p>
        </div>

        <form v-show="isUser">
          <div class="mb-3"><label class="form-label"><span class="bi-person">用户名</span></label><input class="form-control" type="text" v-model="user.uname"></div>
          <div class="mb-3"><label class="form-label"><span class="bi-phone">手机号</span></label><input class="form-control" type="text" v-model="user.utelephone"></div>
          <div class="mb-3"><label class="form-label"><span class="bi-123"> 密码</span></label><input class="form-control" type="text" v-model="user.upassword"></div>
          <div class="mb-3"><label class="form-label"><span class="bi-123"> 确认密码</span></label><input class="form-control" type="email" v-model="uspassword"></div>
          <div class="mb-3"><el-button type="primary" @click="signup()">注册</el-button></div>
        </form>

        <form v-show="!isUser">
          <div class="mb-3"><label class="form-label"><span class="bi-person">用户名</span></label><input class="form-control" type="text" v-model="ventor.vname"></div>
          <div class="mb-3"><label class="form-label"><span class="bi-phone">手机号</span></label><input class="form-control" type="text" v-model="ventor.vtelephone"></div>
          <div class="mb-3"><label class="form-label"><span class="bi-shop-window">店铺名称</span></label><input class="form-control" type="text" v-model="ventor.sname"></div>
          <div class="mb-3"><label class="form-label"><span class="bi-123"> 密码</span></label><input class="form-control" type="text" v-model="ventor.vpassword"></div>
          <div class="mb-3"><label class="form-label"><span class="bi-123"> 确认密码</span></label><input class="form-control" type="email" v-model="vspassword"></div>
          <div class="mb-3"><el-button type="primary" @click="signup()">注册</el-button></div>
        </form>
      </div>
    </section>
  </main>
</template>

<script>
import axios from "axios";

export default {
  name: "Signup",
  data(){
    return{
      isUser: true,

      user:{
        uname:'',
        utelephone:'',
        upassword:'',
      },
      ventor:{
        vname:'',
        vtelephone:'',
        vpassword:'',
        sname:'',
      },
      uspassword:'',
      vspassword:''
    }
  },
  methods:{
    changeRole(){
      this.isUser=!this.isUser;
    },
    signup(){
      if (this.isUser){
        if (this.user.uname === '') {
          this.$message.error("用户名不能为空");
        } else if (this.user.utelephone === ''){
          this.$message.error("手机号不能为空");
        } else if (this.user.utelephone.length !== 11){
          this.$message.error("手机号格式错误");
        } else if (this.user.upassword ==='' || this.uspassword === '') {
          this.$message.error("密码不能为空");
        } else if (this.user.upassword !== this.uspassword){
          this.$message.error("前后密码不一致");
        } else {
          axios.post('http://r44734h518.zicp.vip:41569/user/isSignUp',this.user).then(res=>{
            //先根据手机号请求看是否已经注册
            if(!res.data){
              axios.post('http://r44734h518.zicp.vip:41569/user/insertUser',this.user).then(res=>{
                this.$message.success("注册成功!");
                this.$router.push({path:'/'});
              })
            } else {
              this.$message.error("该账户已被注册!");
            }
          })
        }
      } else {
        if (this.ventor.vname === '') {
          this.$message.error("用户名不能为空");
        } else if (this.ventor.vtelephone === ''){
          this.$message.error("手机号不能为空");
        } else if (this.ventor.vtelephone.length !== 11){
          this.$message.error("手机号格式错误");
        } else if (this.ventor.vsname === ''){
          this.$message.error("店铺名不能为空");
        } else if (this.ventor.vpassword ==='' || this.vspassword === '') {
          this.$message.error("密码不能为空");
        } else if (this.ventor.vpassword !== this.vspassword){
          this.$message.error("前后密码不一致");
        } else {
          axios.get('http://r44734h518.zicp.vip:41569/ventor/registVentor?'+'vname='+this.ventor.vname+'&vtelephone='+this.ventor.vtelephone+'&vpassword='+this.ventor.vpassword+'&sname='+this.ventor.sname).then(res=>{
            if(res.data){
              axios.get('').then(res=>{
                this.$message.success("注册成功!");
                this.$router.push({path:'/'});
              })
            } else {
              this.$message.error("该账户已被注册!");
            }
          })
        }
      }
    }
  },
  beforeCreate() {
    if (sessionStorage.getItem("isLogin")){
      this.$message.warning("你已登录");
      this.$router.push({path:'/infos'});
    }
  }
}
</script>

<style scoped>

</style>
